<!DOCTYPE html>
<%@page import="busqueda.ZombieBusqueda"%>
<html>
<head>
		
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	
	<r:require modules="bootstrap"/>
	<r:layoutResources/>
</head>
<body>
<div id="header" style="margin-left:20px; float:left">
<img src="${resource(dir:'images',file:'almanaquezombie.png')}" class="pull-left" height="150" width="700"/>
<h1 id="titulo" style="color:#CC4040;">Almanaque Zombie</h1> 
<form>
<fieldset>
<label>Nombre Zombie:</label>
<input type="text" name="nombreBusqueda" id="nombreBusqueda" class="input" placeholder="Escriba Nombre..." value="${zombieBusqueda?.nombreBusqueda}"> 
<button type="submit" class="btn btn-warning">
Buscar</button>
</fieldset>
</form>
</div>
<div id="content"><br />
<div id="tabla" style="margin-left:10px; width: 800px">
<TABLE class="table">
<thead>
	<g:sortableColumn property="nombre"	title="Zombie" />
	<g:sortableColumn property="puntosDanio" title="Poder defensivo" />
	<g:sortableColumn property="capacidadDefensiva" title="Poder Ofensivo" />
	<g:sortableColumn property="capacidadDefensiva" title="Descripcion"/>
</thead>
<tbody>
	<g:each in="${zombies}" status="i"	var="zombie">							
		<tr class="${(i % 2) == 0 ? 'info' : ''}">
		<td>
			${fieldValue(bean: zombie, field:"nombre")}
		</td>
			<td style="text-align: right;">
			${fieldValue(bean: zombie, field:"potencia")}
			</td>
		<td style="text-align: right;">
			${fieldValue(bean: zombie, field:"vida")}
			</td>
		<td style="text-align: right;">
			${fieldValue(bean: zombie, field:"descripcion")}
			</td>
		</tr>
		</g:each>
		</tbody>
</TABLE></div>
</div>
</div>
</body>
</HTML>